<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<div class="panel border-back" id="write_goods_info_div">
	<div class="panel-body">
		<div class="line-big">
			<div class="xl6 text-left">
				<button class="button border-blue" id="select_all_a_pic_id">
					<span class="icon-star"></span> 全选
				</button>
				<button class="button border-blue" id="reverse_select_all_a_pic_id">
					<span class="icon-star-half-empty"></span> 反选
				</button>
				<button class=" button bg-red" id="batch_delete_a_pic">
					<span class="icon-trash-o"></span> 批量删除
				</button>
			</div>
			<div class="xl6 text-right">
				<button class="button border-blue" id="enable_drag_list_button" data-type="0">
					<span class="icon-arrows"></span> 启用排序功能
				</button>
			</div>
		</div>

	</div>
	<div class="panel-foot bg-yellow-light border-back">
		<div class="line-big">
			<div class="xl3 text-center border-small border-right border-blue">广告图片</div>
			<div class="xl3 text-center border-small border-right border-blue">广告链接</div>
			<div class="xl2 text-center border-small border-right border-blue">广告标题</div>
			<div class="xl2 text-center border-small border-right border-blue">添加时间</div>
			<div class="xl2 text-center">操作</div>
		</div>
	</div>
	<ul class="list-group list-striped" id="a_pic_drag_ul">
		<c:forEach items="${advertisementList }" var="a" varStatus="aStat">
			<li id="li_${a.advertisementId }" data-id="${a.advertisementId }">
				<div class="line-big">
					<div class="xl3 text-left">
						<input class="a_pic_id_check_box" type="checkbox" data-id="${a.advertisementId }" data-li="#li_${a.advertisementId }">
						<img alt="" class="margin-left-big" src="${a.advertisementPicture }" style="max-height: 80px; max-width: 90%;">
					</div>
					<div class="xl3 text-left" style="overflow: auto;">
						<p>${a.advertisementLink }</p>
					</div>
					<div class="xl2 text-left">${a.advertisementTitle }</div>
					<div class="xl2 text-center">
						<span> 添加时间： <fmt:formatDate value="${a.advertisementAddTime }" pattern="yyyy-MM-dd HH:mm" />
						</span><br> <span> 修改时间： <fmt:formatDate value="${a.advertisementUpdateTime }" pattern="yyyy-MM-dd HH:mm" />
						</span>
					</div>
					<div class="xl2 text-center">
						<button class="advertisement_need_update_button button button-little bg-blue" data-id="${a.advertisementId }">
							<span class="icon-pencil"></span> 修改
						</button>
						<button class="delete_advertisement_button button button-little bg-red margin-left" data-id="${a.advertisementId }" data-li="#li_${a.advertisementId }">
							<span class="icon-trash-o"></span> 删除
						</button>
					</div>
				</div>
			</li>
		</c:forEach>
	</ul>
</div>

<div id="see_goods_detail"></div>
<script type="text/javascript" src="js/pintuer.js"></script>
<script type="text/javascript">
	$(function()
	{
		$(".advertisement_need_update_button").click(function()
		{
			$("#admin_div").load("shop/shop_update_a_pic?id=" + $(this).attr("data-id"), {}, function()
			{

			});
		});

		$("#select_all_a_pic_id").click(function()
		{
			$(".a_pic_id_check_box").attr("checked", true);
		});
		$("#reverse_select_all_a_pic_id").click(function()
		{
			$(".a_pic_id_check_box").each(function()
			{
				$(this).attr("checked", !this.checked);
			});
		});
		$("#batch_delete_a_pic").click(function()
		{
			var ids = "";
			var num = 0;
			$("input.a_pic_id_check_box:checked").each(function()
			{
				ids += $(this).attr("data-id") + ",";
				num++;
			});
			if (ids.length <= 0)
			{
				alert("请先勾选需要操作的宣传图片");
				return false;
			}
			ids = ids.substring(0, ids.length - 1);

			if (confirm("确认批量删除这 " + num + " 个宣传图片吗?") == false)
			{
				return false;
			}

			$("#batch_delete_a_pic").attr("disabled", "disabled");
			$.post("admin/m_delete_a_pic_do",
			{
				"commonStr" : ids
			}, function(json)
			{
				if (json.success == false)
				{
					alert(json.info);
					$("#batch_delete_a_pic").removeAttr("disabled");
					toastr.error(json.info, '操作失败!');
				}
				else
				{
					$("#batch_delete_a_pic").removeAttr("disabled");
					$("input.a_pic_id_check_box:checked").each(function()
					{
						$($(this).attr("data-li")).remove();
					});
					toastr.success('操作成功了!');
				}
			},
			//返回类型
			"json");
		});

		$(".delete_advertisement_button").each(function()
		{
			$(this).click(function()
			{
				if (confirm("确认删除此宣传图片吗?") == false)
				{
					return false;
				}
				var ids = "";
				ids = $(this).attr("data-id");
				var obj = $(this);

				obj.attr("disabled", "disabled");
				$.post("admin/m_delete_a_pic_do",
				{
					"commonStr" : ids
				}, function(json)
				{
					if (json.success == false)
					{
						alert(json.info);
						obj.removeAttr("disabled");
						toastr.error(json.info, '操作失败!');
					}
					else
					{
						obj.removeAttr("disabled");
						$(obj.attr("data-li")).remove();
						toastr.success('操作成功了!');
					}
				},
				//返回类型
				"json");
			});
		});

		$("#enable_drag_list_button").click(function()
		{
			var obj = $(this);
			if ($(this).attr("data-type") == "0")
			{
				//停用拖拽排序
				$("#a_pic_drag_ul").dragsort("destroy");
				//启动拖拽排序
				$("#a_pic_drag_ul").dragsort(
				{
					dragSelector : "li",
					dragEnd : function()
					{
					},
					scrollSpeed : 10,
					dragBetween : false,
					placeHolderTemplate : '<li style="border:1px solid blue;background:yellow;min-height:60px;"></li>'
				});
				$(this).attr("data-type", "1");
				$(this).html('<span class="icon-upload"></span> 提交排序结果');
				alert("可以对列表进行拖拽排序了。排序完之后不要忘了提交排序结果。");
			}
			else if ($(this).attr("data-type") == "1")
			{
				//停用拖拽排序
				$("#a_pic_drag_ul").dragsort("destroy");

				var idStr = "";
				$("#a_pic_drag_ul>li").each(function(i, n)
				{
					idStr += $(n).attr("data-id") + ",";
				});
				if (idStr.length <= 0)
				{
					alert("没有找到需要提交的排序");
					return false;
				}

				idStr = idStr.substring(0, idStr.length - 1);

				obj.attr("disabled", "disabled");
				$.post("admin/m_set_a_pic_order_do",
				{
					"commonStr" : idStr
				}, function(json)
				{
					if (json.success == false)
					{
						alert(json.info);
						obj.removeAttr("disabled");
						toastr.error(json.info, '操作失败!');
					}
					else
					{
						obj.removeAttr("disabled");
						toastr.success('操作成功了!');
					}
				},
				//返回类型
				"json");

				$(this).attr("data-type", "0");
				$(this).html('<span class="icon-arrows"></span> 启用排序功能');
			}
		});

	});
</script>